import { SubjectType } from '@/apis';
import { getAreaConfig, getIndustryConfig, getTagTypeConfig } from '@/utils/filterConfig';
import { ComponentType } from 'vc';
import type { ILoss } from '../apis/types';

export function useScreen() {
  const PAGE_SIZE = 15;

  const queryData = reactive<ILoss>({
    pageNum: 1,
    pageSize: PAGE_SIZE,
    searchTxt: '',
    sortRule: '',
    provinceCode: '',
    cityCode: '',
    countryCode: '',
    industryCategoryCodeLv1: '',
    industryCategoryCodeLv2: '',
    industryCategoryCodeLv3: '',
    tagTypeCode: ''
  });

  const screen = ref([
    {
      ...getAreaConfig().value,
      submitFn: (val) => {
        const { lv1, lv2, lv3 } = val;
        queryData.provinceCode = lv1.join();
        queryData.cityCode = lv2.join();
        queryData.countryCode = lv3.join();
      }
    },
    {
      ...getIndustryConfig().value,
      submitFn: (val) => {
        const { lv1, lv2, lv3 } = val;
        queryData.industryCategoryCodeLv1 = lv1?.join() || '';
        queryData.industryCategoryCodeLv2 = lv2?.join() || '';
        queryData.industryCategoryCodeLv3 = lv3?.join() || '';
      }
    },
    {
      ...getTagTypeConfig(SubjectType.PERIMIT_LOSS).value,
      submitFn: (data) => {
        queryData.tagTypeCode = data;
      }
    },
    {
      title: '遗失日期',
      component: ComponentType.DATE,
      type: 'daterange',
      shortcuts: [180, 365, 365 * 3],
      submitFn: (data) => {
        queryData.lossStartDate = data[0] || '';
        queryData.lossEndDate = data[1] || '';
      }
    }
  ]);

  return {
    PAGE_SIZE,
    queryData,
    screen
  };
}
